<template>
  <div>
    <Card dis-hover :bordered="false" class="ivu-mt">
      <Row :gutter="16" type="flex" justify="space-between" class="ivu-mb-16">
        <Col>
          <Row :gutter="16" type="flex">
            <Col>
              <Input
                placeholder="请输入姓名/手机号/微信号"
                v-model="params.keyword"
                clearable
                @on-enter="askDatas"
                @on-clear="askDatas"
              />
            </Col>
            <Col>
              <Select
                placeholder="线索状态"
                v-model="params.clue_status_id"
                filterable
                clearable
                v-width="150"
                @on-change="askDataing"
              >
                <Option
                  v-for="item in clueList"
                  :value="item.value"
                  :key="item.value"
                  >{{ item.label }}</Option
                >
              </Select>
            </Col>
            <Col>
              <TreeSelect
                v-width="150"
                v-model="params.source_channel_id"
                :data="channelList"
                filterable
                clearable
                placeholder="来源渠道"
                @on-change="askDataing"
              />
            </Col>
            <Col>
              <Select
                placeholder="部门"
                v-model="params.departmentId"
                filterable
                clearable
                v-width="150"
                @on-change="changeDepartment"
              >
                <Option
                  v-for="item in department"
                  :key="item.value"
                  :value="item.value"
                  >{{ item.label }}
                </Option>
              </Select>
            </Col>
            <Col>
              <Select
                placeholder="客服人员"
                v-model="params.input_id"
                filterable
                clearable
                v-width="150"
                @on-change="askDataing"
              >
                <Option
                  v-for="item in operationMember"
                  :key="item.value"
                  :value="item.value"
                  >{{ item.label }}
                </Option>
              </Select>
            </Col>
            <Col>
              <Select
                placeholder="联系人员"
                v-model="params.contact_id"
                filterable
                clearable
                v-width="150"
                @on-change="askDataing"
              >
                <Option
                  v-for="item in contact_member"
                  :key="item.value"
                  :value="item.value"
                  >{{ item.label }}
                </Option>
              </Select>
            </Col>
            <Col>
              <DatePicker
                :editable="false"
                type="daterange"
                v-model="timedate"
                :options="options"
                placeholder="请选择创建日期"
                v-width="200"
                @on-change="askDatatime"
              ></DatePicker>
            </Col>
            <Col
              style="display: flex;align-items: center;justify-content: center;"
            >
              <CheckboxGroup @on-change="checkbox3">
                <Checkbox label="重复"></Checkbox>
              </CheckboxGroup>
              <CheckboxGroup @on-change="checkbox4">
                <Checkbox label="手机号"></Checkbox>
              </CheckboxGroup>
            </Col>
          </Row>
        </Col>
        <Col>
          <Button
            v-hasC="{
              name: 'v1-clue-user-export',
              flag: 'v1/clue/user/export',
            }"
            type="primary"
            class="ivu-mr-8"
            :disabled="total === 0"
            :loading="buttonloading"
            @click="clickexport"
            >{{ buttonloading ? "正在导出" : "导出" }}</Button
          >
          <Button
            type="primary"
            v-if="buttonbool"
            class="ivu-mr-8"
            @click="clickexports"
          >
            下载
          </Button>
          <Button
            v-hasC="{
              name: 'clue-user-info1',
              flag: 'v1/clue/user/info',
            }"
            type="primary"
            @click="handleedit()"
            >录入</Button
          >
        </Col>
      </Row>
      <div class="ivu-clearfix"></div>
      <Table
        highlight-row
        ref="table"
        :columns="columns"
        :data="data"
        :max-height="600"
        :loading="loading"
        size="small"
      >
        <template slot-scope="{ row }" slot="info">
          <a @click="openInfo(row)">{{ row.info }}</a>
        </template>
        <template slot-scope="{ row }" slot="post">
          <Poptip word-wrap trigger="hover" placement="right" maxWidth="400">
            <Tag
              color="default"
              v-for="(item, index) in row.parts"
              :key="index"
              v-if="index < 3"
              >{{ item }}
            </Tag>
            <div slot="content">
              <Tag v-for="(item, index) in row.parts" :key="index">{{
                item
              }}</Tag>
            </div>
          </Poptip>
        </template>
        <template slot-scope="{ row }" slot="state">
          <div v-if="row.clue_status_name">
            <Tag v-if="row.type === 1" color="warning">{{
              row.clue_status_name
            }}</Tag>
            <Tag v-else-if="row.type === 2" color="primary">{{
              row.clue_status_name
            }}</Tag>
            <Tag v-else-if="row.type === 3" color="default">{{
              row.clue_status_name
            }}</Tag>
            <Tag v-else-if="row.type === 4" color="success">{{
              row.clue_status_name
            }}</Tag>
            <Tag v-else>{{ row.clue_status_name }}</Tag>
          </div>
        </template>
        <template slot-scope="{ row }" slot="operation">
          <span v-if="row.type === 4">{{ row.contact_name }}</span>
          <span v-else>
            <a
              v-hasC="{
                name: 'clue-user-info3',
                flag: 'v1/clue/user/info',
              }"
              @click="handleContactClue(row)"
              >联系</a
            >
            <Divider
              v-hasC="{
                name: 'clue-user-info2',
                flag: 'v1/clue/user/info',
              }"
              type="vertical"
            />
            <a
              v-hasC="{
                name: 'clue-user-info2',
                flag: 'v1/clue/user/info',
              }"
              @click="handleedit(row)"
              >编辑</a
            >
          </span>
          <Divider
            type="vertical"
            v-if="row.repeat_type === '1'"
            v-hasC="{
              name: 'v1-patient-index-repeat-list5',
              flag: 'v1/patient/index/repeat-list',
            }"
          />
          <a
            v-if="row.repeat_type === '1'"
            v-hasC="{
              name: 'v1-patient-index-repeat-list5',
              flag: 'v1/patient/index/repeat-list',
            }"
            @click="repeatData(row)"
            >重复</a
          >
          <Divider
            type="vertical"
            v-if="row.repeat_user === '1'"
            v-hasC="{
              name: '-v1-clue-user-repeat-user',
              flag: '/v1/clue/user/repeat-user',
            }"
          />
          <a
            v-if="row.repeat_user === '1'"
            v-hasC="{
              name: '-v1-clue-user-repeat-user',
              flag: '/v1/clue/user/repeat-user',
            }"
            @click="repeatuser(row)"
            >患者重复</a
          >
        </template>
      </Table>
      <div class="ivu-mt ivu-text-center">
        <Page
          show-total
          show-elevator
          show-sizer
          :total="total"
          :current.sync="params.page"
          :page-size="params.pageSize"
          :page-size-opts="pageOpts"
          @on-change="formSize"
          @on-page-size-change="formChangePage"
        />
      </div>
    </Card>
    <Modal
      ref="contact"
      title="联系线索客户"
      v-model="contactClue"
      :mask-closable="false"
      width="1000"
      @on-cancel="handleDrawerCancel('formItem')"
    >
      <DescriptionList :col="3">
        <!-- { id: undefined, user_name: '', mobile: '', wechat_num: '', age: undefined, gender: '', channel_id: '', customer_remark: '', body_parts_ids: [],upload_talk_img: [] }, -->
        <Description term="基本信息：">
          {{ createDatas.user_name }} {{ createDatas.gender_str }}
          <span v-if="createDatas.age"> {{ createDatas.age }}岁 </span>
        </Description>
        <Description term="手机号：">{{ createDatas.mobile }} </Description>
        <Description term="微信号：">{{ createDatas.wechat_num }} </Description>
        <!-- <Description term="QQ：">
                    {{ createDatas.qq_num }}
                </Description> -->
        <Description term="抖音号：">
          {{ createDatas.dy_num }}
        </Description>
        <Description term="部位：">
          <tag
            v-for="(item, index) in createDatas.body_parts_arr"
            :key="index"
            >{{ item }}</tag
          >
        </Description>
        <Description term="渠道：">{{ createDatas.channel }}</Description>
      </DescriptionList>
      <DescriptionList :col="1">
        <Description term="客服备注：">{{
          createDatas.customer_remark
        }}</Description>
      </DescriptionList>
      <Row :gutter="16" style="max-height: 340px; overflow: auto;">
        <Col
          span="8"
          v-for="(item, index) in createDatas.upload_talk_img"
          :key="index"
          ><img
            style="height: 330px; width: 186px; object-fit: cover;"
            @click="
              (imgNames = `${createDatas.images_host}${item}`),
                (visibles = true)
            "
            :src="`${createDatas.images_host}${item}`"
        /></Col>
      </Row>
      <Divider></Divider>
      <Form
        label-position="top"
        :model="params1"
        ref="formItem"
        :rules="createRuless"
      >
        <Row>
          <Col span="8">
            <FormItem label="联系结果">
              <RadioGroup
                v-model="params1.clue_status_id"
                @on-change="changeclue"
              >
                <Radio
                  :label="item.value"
                  v-for="item in clueList"
                  :key="item.value"
                  v-if="+item.value !== 9"
                  ><span>{{ item.label }}</span></Radio
                >
              </RadioGroup>
            </FormItem>
            <Timeline style="max-height: 380px; overflow: auto;">
              <TimelineItem v-for="item in contact" :key="item.id">
                <p class="time ivu-mb-8">
                  {{ item.created_at }}
                </p>
                <p class="content ivu-mb-8">
                  {{ item.remark }}
                </p>
                <p class="consultant ivu-mb-8">
                  <span class="c-inr ivu-mr-8">{{ item.realname }}</span>
                  <Badge
                    v-if="item.status_name === '未联系上'"
                    status="success"
                    :text="item.status_name"
                  />
                  <Badge
                    v-if="item.status_name === '无效'"
                    status="processing"
                    :text="item.status_name"
                  />
                  <Badge
                    v-if="item.status_name === '转客户'"
                    status="warning"
                    :text="item.status_name"
                  />
                  <Badge
                    v-if="item.status_name === '新数据'"
                    status="default"
                    :text="item.status_name"
                  />
                </p>
              </TimelineItem>
            </Timeline>
          </Col>
          <Col span="16">
            <template v-if="params1.clue_status_id === '8'">
              <Row :gutter="24">
                <Col span="5">
                  <FormItem label="姓名">
                    <Input
                      v-model="params1.userName"
                      placeholder="请输入姓名"
                    />
                  </FormItem>
                </Col>
                <Col span="6">
                  <FormItem label="性别">
                    <RadioGroup v-model="params1.sex">
                      <Radio :label="0">未知</Radio>
                      <Radio :label="1">男</Radio>
                      <Radio :label="2">女</Radio>
                    </RadioGroup>
                  </FormItem>
                </Col>
                <Col span="4">
                  <FormItem label="年龄" prop="age">
                    <InputNumber
                      :max="100"
                      :min="1"
                      v-model="params1.age"
                    ></InputNumber>
                  </FormItem>
                </Col>
                <Col span="9">
                  <FormItem label="城市" required>
                    <!-- <Select ref="citySearch" v-model="params1.city" placeholder="请输入城市拼音简写" filterable
                                    remote clearable :remote-method="remoteMethod" :loading="loadingcity"
                                    @on-change="changeRemote">
                                    <Option v-for="item in optionscity" :value="item.value" :key="item.value">{{
                                        item.label }}</Option>
                                </Select> -->
                    <jgcheckcity
                      ref="checkcity"
                      @cityvalue="cityvalue"
                      v-model="city_id"
                      :name="`entry`"
                    />
                  </FormItem>
                </Col>
              </Row>
              <Row :gutter="24">
                <Col span="8">
                  <FormItem label="手机号" prop="mobile">
                    <Input
                      v-model="params1.mobile"
                      @on-keyup="
                        params1.mobile = params1.mobile.replace(
                          /\s+|[\r\n]/g,
                          ''
                        )
                      "
                      @on-blur="telrepeat(params1.mobile)"
                      placeholder="请输入手机号"
                    />
                  </FormItem>
                </Col>
                <Col span="8">
                  <FormItem label="微信号">
                    <Input
                      v-model="params1.weChartNum"
                      @on-keyup="
                        params1.weChartNum = params1.weChartNum.replace(
                          /\s+|[\r\n]/g,
                          ''
                        )
                      "
                      @on-blur="WXrepeat(params1.weChartNum)"
                      placeholder="请输入微信号"
                    />
                  </FormItem>
                </Col>
              </Row>
              <Row :gutter="24">
                <Col span="8">
                  <FormItem label="一级病种" prop="oneDiseases">
                    <Select
                      ref="oneSelects"
                      placeholder="请选择一级病种"
                      :key="Math.random() * 10 + 1"
                      v-model="params1.oneDiseases"
                      clearable
                      @on-clear="clearOne"
                      @on-change="changeOne"
                    >
                      <Option
                        v-for="item in diseasesArr1"
                        :value="item.value"
                        :key="item.value"
                        >{{ item.label }}</Option
                      >
                    </Select>
                  </FormItem>
                </Col>
                <Col span="8">
                  <FormItem
                    label="二级病种"
                    prop="twoDiseases"
                    :rules="twoRules"
                    v-show="diseasesArr2.length > 0"
                  >
                    <Select
                      placeholder="请选择二级病种"
                      v-model="params1.twoDiseases"
                      clearable
                      :key="Math.random() * 10 + 1"
                    >
                      <Option
                        v-for="item in diseasesArr2"
                        :value="item.value"
                        :key="item.value"
                        >{{ item.label }}</Option
                      >
                    </Select>
                  </FormItem>
                </Col>
                <Col span="8">
                  <FormItem label="患者状态" prop="patientStatus">
                    <Select
                      placeholder="请选择"
                      v-model="params1.patientStatus"
                      clearable
                    >
                      <Option
                        v-for="item in patientStatusArr"
                        :value="item.value"
                        :disabled="+item.is_select === 0"
                        :key="item.value"
                        >{{ item.label }}</Option
                      >
                    </Select>
                  </FormItem>
                </Col>
              </Row>
              <Row>
                <Col span="12">
                  <FormItem label="部位" prop="bodyPart" :rules="bodyPartRule">
                    <TreeSelect
                      :max-tag-count="2"
                      v-model="params1.bodyPart"
                      :data="postList"
                      clearable
                      multiple
                    />
                  </FormItem>
                </Col>
              </Row>
              <template
                v-if="
                  +params1.patientStatus === 2 || +params1.patientStatus === 1
                "
              >
                <FormItem label="下次回访时间" prop="day">
                  <Row :gutter="16" type="flex">
                    <Col>
                      <InputNumber
                        :formatter="$inputday"
                        :step="1"
                        :min="0"
                        v-model.number="params1.day"
                        @on-change="blurday(params1.day)"
                      >
                      </InputNumber>
                    </Col>
                    <Col>天后</Col>
                    <Col>
                      <DatePicker
                        :editable="false"
                        :options="optionss"
                        type="date"
                        v-model="DatePicker"
                        @on-change="changeday(DatePicker)"
                        placeholder="请输入回访时间"
                      >
                      </DatePicker>
                    </Col>
                  </Row>
                </FormItem>
              </template>
              <template v-if="+params1.patientStatus === 1">
                <FormItem label="预到时间" prop="day1">
                  <Row :gutter="16" type="flex">
                    <Col>
                      <InputNumber
                        :formatter="$inputday"
                        :step="1"
                        :min="0"
                        v-model.number="params1.day1"
                        @on-change="blurday1(params1.day1)"
                      >
                      </InputNumber>
                    </Col>
                    <Col>天后</Col>
                    <Col>
                      <DatePicker
                        :editable="false"
                        :options="optionss"
                        type="date"
                        v-model="DatePicker1"
                        @on-change="changeday1(DatePicker1)"
                        placeholder="请输入预约时间"
                      >
                      </DatePicker>
                    </Col>
                  </Row>
                </FormItem>
              </template>
            </template>
            <FormItem label="备注" prop="remark" :rules="remarkRule">
              <Input
                type="textarea"
                placeholder="请备注原因"
                v-model="params1.remark"
                :autosize="{ minRows: 2, maxRows: 8 }"
              />
            </FormItem>
          </Col>
        </Row>
      </Form>
      <div slot="footer">
        <Button @click="handleDrawerCancel('formItem')">取消</Button>
        <Button
          type="primary"
          :loading="remarksloading"
          @click="handlesearch('formItem')"
          >确定</Button
        >
      </div>
    </Modal>
    <Drawer
      v-model="showCreate"
      :mask-closable="false"
      :title="edit ? '录入线索' : '编辑线索'"
      :loading="creating"
      width="900"
    >
      <Form
        ref="create"
        :model="createData"
        label-position="top"
        :rules="createRules"
      >
        <Row :gutter="24">
          <Col span="6">
            <FormItem label="姓名">
              <Input v-model="createData.user_name" placeholder="请输入姓名" />
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="手机号" prop="mobile">
              <Input
                v-model="createData.mobile"
                @on-blur="telrepeat(createData.mobile)"
                @on-keyup="
                  createData.mobile = createData.mobile.replace(
                    /\s+|[\r\n]/g,
                    ''
                  )
                "
                placeholder="请输入手机号"
              ></Input>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="微信号">
              <Input
                v-model="createData.wechat_num"
                @on-blur="WXrepeat(createData.wechat_num)"
                placeholder="请输入微信号"
                @on-keyup="
                  createData.wechat_num = createData.wechat_num.replace(
                    /\s+|[\r\n]/g,
                    ''
                  )
                "
              ></Input>
            </FormItem>
          </Col>
          <Col span="6">
            <!-- <FormItem label="QQ号" prop="qq_num">
                        <Input v-model="createData.qq_num" placeholder="请输入QQ号"></Input>
                    </FormItem> -->
            <FormItem label="抖音号" prop="dy_num">
              <Input
                v-model="createData.dy_num"
                @on-blur="DYrepeat(createData.dy_num)"
                @on-keyup="
                  createData.dy_num = createData.dy_num.replace(
                    /\s+|[\r\n]/g,
                    ''
                  )
                "
                placeholder="请输入抖音号"
              ></Input>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="部位">
              <!-- <Select v-model="createData.body_parts_ids" clearable multiple :max-tag-count="2">
                                <OptionGroup v-for="item in postList" :key="item.value" :label="item.label">
                                    <Option v-for="it in item.children" :value="it.value" :key="it.value">{{ it.label }}</Option>
                                </OptionGroup>
                            </Select> -->
              <TreeSelect
                v-model="createData.body_parts_ids"
                :data="postList"
                clearable
                multiple
              />
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="年龄">
              <InputNumber
                :max="100"
                :min="1"
                v-model="createData.age"
              ></InputNumber>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="性别">
              <RadioGroup v-model="createData.gender">
                <Radio :label="1">男</Radio>
                <Radio :label="2">女</Radio>
                <Radio :label="0">未知</Radio>
              </RadioGroup>
            </FormItem>
          </Col>
          <Col span="6">
            <FormItem label="渠道">
              <TreeSelect
                v-width="150"
                v-model="createData.channel_id"
                :data="channelList"
                filterable
                clearable
                placeholder="来源渠道"
              />
            </FormItem>
          </Col>
          <Col span="24">
            <FormItem label="渠道备注">
              <Input
                v-model="createData.source_remark"
                placeholder="请输入"
              ></Input>
            </FormItem>
          </Col>
          <Col span="24">
            <FormItem label="备注">
              <Input
                v-model="createData.customer_remark"
                placeholder="请输入"
              ></Input>
            </FormItem>
          </Col>
          <Col span="24" class="ivu-mb">
            <template>
              <div
                class="demo-upload-list"
                v-for="(item, index) in uploadList"
                :key="index"
              >
                <template>
                  <img :src="item.url" />
                  <div class="demo-upload-list-cover">
                    <Icon
                      type="ios-eye-outline"
                      @click.native="handleView(item.url)"
                    ></Icon>
                    <Icon
                      type="ios-trash-outline"
                      @click.native="removeUpload(item.urls)"
                    ></Icon>
                  </div>
                </template>
              </div>
              <Upload
                ref="upload"
                :on-success="successUpload"
                :default-file-list="defaultList"
                :format="['jpg', 'jpeg', 'png']"
                :show-upload-list="false"
                multiple
                type="drag"
                :data="datas"
                name="files"
                :action="`${url}/v1/upload/images`"
                style="display: inline-block; width: 58px;"
              >
                <!-- <div style="padding: 20px 0">
                                    <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
                                    <p>请点击上传或拖入聊天图片上传</p>
                                </div> -->
                <div
                  style="
                                        width: 58px;
                                        height: 58px;
                                        line-height: 58px;
                                    "
                >
                  <Icon type="ios-camera" size="20"></Icon>
                </div>
              </Upload>
              <span style="padding-left: 10px;"
                >请点击上传或拖入聊天图片上传</span
              >
              <Modal title="聊天记录" footer-hide v-model="visible" width="480">
                <img :src="imgName" v-if="visible" style="width: 100%;" />
              </Modal>
            </template>
          </Col>
        </Row>
        <div class="demo-drawer-footer">
          <Button style="margin-right: 8px;" @click="handleDrawerCancels"
            >取消</Button
          >
          <Button type="primary" :loading="remarksloading" @click="handleCreate"
            >保存</Button
          >
        </div>
      </Form>
      <div class="ivu-pt-16" v-if="!edit">
        <Timeline class="ivu-mt-16">
          <TimelineItem
            v-for="(item, index) in clue_contact_results_list"
            :key="index"
          >
            <p class="time">{{ item.created_at }}</p>
            <p class="content">{{ item.remark }}</p>
          </TimelineItem>
        </Timeline>
      </div>
    </Drawer>
    <Modal
      ref="contact"
      :footer-hide="true"
      title="线索详细"
      v-model="showInfoModal"
      :mask-closable="false"
      width="750"
    >
      <DescriptionList :col="3">
        <Description term="基本信息：">
          <template v-if="infoData.info"
            >{{ infoData.info.user_name }}
            {{ infoData.info.gender_str }}
            <span v-if="infoData.info.age"> {{ infoData.info.age }}岁 </span>
          </template>
        </Description>
        <Description term="手机号：">
          <template v-if="infoData.info">{{ infoData.info.mobile }}</template>
        </Description>
        <Description term="微信号：">
          <template v-if="infoData.info">{{
            infoData.info.wechat_num
          }}</template>
        </Description>
      </DescriptionList>
      <DescriptionList :col="3">
        <!-- <Description term="QQ：">
                    <template v-if="infoData.info">{{
                        infoData.info.qq_num
                        }}</template>
                </Description> -->
        <Description term="抖音号：">
          <template v-if="infoData.info">{{ infoData.info.dy_num }}</template>
        </Description>
        <Description term="部位：">
          <template v-if="infoData.info">
            <Tooltip placement="top-start" :max-width="300">
              <template v-for="(item, index) in infoData.info.body_parts_arr">
                <tag v-if="index <= 2" :key="index">{{ item }}</tag>
              </template>
              <div slot="content">
                <tag
                  v-for="(item, index) in infoData.info.body_parts_arr"
                  :key="index"
                  >{{ item }}</tag
                >
              </div>
            </Tooltip>
          </template>
        </Description>
        <Description term="渠道：">
          <template v-if="infoData.info">{{ infoData.info.channel }}</template>
        </Description>
      </DescriptionList>
      <DescriptionList :col="1">
        <Description term="客服备注：">
          <template v-if="infoData.info">{{
            infoData.info.customer_remark
          }}</template>
        </Description>
      </DescriptionList>
      <template v-if="infoData.info">
        <Row :gutter="16" style="max-height: 340px; overflow: auto;">
          <Col
            span="8"
            v-for="(item, index) in infoData.info.upload_talk_img"
            :key="index"
            ><img
              style="
                                height: 330px;
                                width: 186px;
                                object-fit: cover;
                            "
              @click="
                (imgNames = `${infoData.info.images_host}${item}`),
                  (visibles = true)
              "
              :src="`${infoData.info.images_host}${item}`"
          /></Col>
        </Row>
      </template>
      <template>
        <Timeline style="max-height: 380px; overflow: auto;">
          <TimelineItem v-for="item in infoData.contact" :key="item.id">
            <p style="font-weight: 600;" class="time">
              {{ item.created_at }}
            </p>
            <p class="content ivu-pt-8 ivu-pb-8">{{ item.remark }}</p>
            <p class="consultant">
              <span class="c-inr ivu-mr-8">{{ item.realname }}</span>
              <Badge
                v-if="item.status_name === '未联系上'"
                status="success"
                :text="item.status_name"
              />
              <Badge
                v-if="item.status_name === '无效'"
                status="processing"
                :text="item.status_name"
              />
              <Badge
                v-if="item.status_name === '转客户'"
                status="warning"
                :text="item.status_name"
              />
              <Badge
                v-if="item.status_name === '新数据'"
                status="default"
                :text="item.status_name"
              />
            </p>
          </TimelineItem>
        </Timeline>
      </template>
    </Modal>
    <Modal title="线索图片" footer-hide v-model="visibles" width="480">
      <img :src="imgNames" v-if="visibles" style="width: 100%;" />
    </Modal>
    <Modal
      title="重复数据"
      :mask-closable="false"
      footer-hide
      :width="80"
      v-model="repeatDatas"
    >
      <Table
        :max-height="400"
        :columns="repeatColumns"
        :data="repeatDataList"
        :loading="entryloading"
      >
        <template slot="user_name" slot-scope="{ row }">
          <span>{{ row.user_name }}</span>
          <span>{{
            row.gender === "0" ? "未知" : row.gender === "1" ? "男" : "女"
          }}</span>
          <span v-if="row.age">{{ row.age }}</span>
        </template>
        <template slot="mobile" slot-scope="{ row }">
          <span
            v-if="
              +repeatInfo.repeat_type === 3 ||
                +repeatInfo.repeat_type === 5 ||
                +repeatInfo.repeat_type === 6 ||
                +repeatInfo.repeat_type === 7
            "
            :class="
              row.mobile && row.mobile === repeatInfo.mobile
                ? 'repeatColor'
                : null
            "
          >
            {{ row.mobile }}
          </span>
          <span v-else>{{ row.mobile }}</span>
        </template>
        <template slot="wechat_num" slot-scope="{ row }">
          <span
            v-if="
              +repeatInfo.repeat_type === 2 ||
                +repeatInfo.repeat_type === 4 ||
                +repeatInfo.repeat_type === 6 ||
                +repeatInfo.repeat_type === 7
            "
            :class="
              row.wechat_num && row.wechat_num === repeatInfo.wechat_num
                ? 'repeatColor'
                : null
            "
          >
            {{ row.wechat_num }}
          </span>
          <span v-else>{{ row.wechat_num }}</span>
        </template>
        <template slot="dy_num" slot-scope="{ row }">
          <span
            v-if="
              +repeatInfo.repeat_type === 1 ||
                +repeatInfo.repeat_type === 4 ||
                +repeatInfo.repeat_type === 5 ||
                +repeatInfo.repeat_type === 7
            "
            :class="
              row.dy_num && row.dy_num === repeatInfo.dy_num
                ? 'repeatColor'
                : null
            "
          >
            {{ row.dy_num }}
          </span>
          <span v-else>{{ row.dy_num }}</span>
        </template>
      </Table>
    </Modal>
    <Modal
      title="患者重复数据"
      :mask-closable="false"
      footer-hide
      :width="80"
      v-model="repeatusers"
    >
      <Table
        :max-height="400"
        :columns="repeatuserColumns"
        :data="repeatuserList"
        :loading="entryloadings"
      >
        <template slot="user_name" slot-scope="{ row }">
          <span class="ivu-mr-8">{{ row.user_name }}</span>
          <span class="ivu-mr-8">{{ row.gender }}</span>
          <span v-if="row.age">{{ row.age }}</span>
        </template>
        <template slot="realname" slot-scope="{ row }">
          <span v-if="+row.patient_data_type === 0">{{ row.realname }}</span>
        </template>
        <template slot="status" slot-scope="{ row }">
          <Tag v-if="+row.patient_status_id === 1" color="warning">{{
            row.patient_status
          }}</Tag>
          <Tag v-else-if="+row.patient_status_id === 2" color="primary">{{
            row.patient_status
          }}</Tag>
          <Tag v-else-if="+row.patient_status_id === 3" color="default">{{
            row.patient_status
          }}</Tag>
          <Tag v-else-if="+row.patient_status_id === 4" color="success">{{
            row.patient_status
          }}</Tag>
          <Tag v-else>{{ row.patient_status }}</Tag>
        </template>
      </Table>
    </Modal>
    <copytable
      ref="copytable"
      @submitfun="add_or_edit_patient(edit, createDataing)"
      @cancelfun="remarksloading = false"
    />
  </div>
</template>
<script>
import Setting from "@/setting";
import { mapState, mapMutations } from "vuex";
import {
  clueuserentrylist,
  clueuserinfo,
  clueusercreate,
  clueuserupdate,
  patientindexsearchcity,
  clueusercontact,
  checkPhone_Wx,
  clueusersearchrepeat,
  repeatData,
  clueuserexport,
  patientindexsearchmobile,
  clueuserrepeatuser,
  clueusersearchmobile,
} from "@api/hqapi";
let lodash = require("lodash");
import copytable from "@/components/copytables";
// import jgcheckcity from "@/components/checkcity";
import dayjs from "dayjs";
export default {
  components: { copytable },
  name: "entry",
  data() {
    const validateMobile = (rule, value, callback) => {
      if (value === "") {
        callback();
      } else {
        let reg = /^\d{10,12}$/;
        if (reg.test(value)) {
          callback();
        } else {
          callback(new Error("请输入正确的联系号码"));
        }
      }
    };
    return {
      city_id: [],
      bodyPartList: [],
      entryloading: false,
      entryloadings: false,
      repeatColumns: Object.freeze([
        {
          title: "基本信息",
          slot: "user_name",
        },
        {
          title: "手机号",
          slot: "mobile",
        },
        {
          title: "微信",
          slot: "wechat_num",
        },
        {
          title: "抖音",
          slot: "dy_num",
        },
        {
          title: "录入人员",
          key: "realname",
        },
        {
          title: "录入时间",
          key: "created_at",
        },
      ]),
      repeatuserColumns: Object.freeze([
        {
          title: "基本信息",
          slot: "user_name",
        },
        {
          title: "状态",
          slot: "status",
        },
        {
          title: "归属人",
          slot: "realname",
        },
        {
          title: "创建时间",
          key: "created_at",
        },
      ]),
      repeatDatas: false,
      repeatusers: false,
      repeatInfo: {},
      repeatDataList: [],
      repeatuserList: [],
      selectIndex: 0,
      //  ceshi
      showInfoModal: false,
      defaultList: [],
      imgName: "",
      department: [],
      imgNames: "",
      remarksloading: false,
      infoData: {},
      visible: false,
      visibles: false,
      uploadList: [],
      diseasesArr1: [],
      diseasesArr2: [],
      contact: [],
      // end
      url: "",
      DatePicker: new Date(new Date().getTime() + 86400000),
      DatePicker1: new Date(new Date().getTime()),
      createRuless: {
        remark: [
          {
            required: true,
            type: "string",
            message: "请输入备注原因",
            trigger: "blur",
          },
        ],
        age: [
          {
            required: true,
            message: "请填写年龄",
            type: "number",
            trigger: "blur,change",
          },
        ],
        city: [
          {
            required: true,
            message: "请选择城市",
            trigger: "change",
          },
        ],
        oneDiseases: [
          {
            required: true,
            message: "请选择一级病种",
            trigger: "change",
          },
        ],
        mobile: [{ validator: validateMobile, trigger: "blur" }],
        twoDiseases: [
          {
            required: true,
            message: "请选择二级病种",
            trigger: "change",
          },
        ],
        patientStatus: [
          {
            required: true,
            message: "请选择患者状态",
            trigger: "change",
          },
        ],
        // bodyPart: [
        //     { required: true, validator: validateBodyPart, trigger: "change" }
        // ],
        day: [
          {
            required: true,
            type: "number",
            message: "请输入回访时间",
            trigger: "blur",
          },
        ],
        day1: [
          {
            required: true,
            type: "number",
            message: "请输入预约",
            trigger: "blur",
          },
        ],
      },
      list: [],
      contact_member: [],
      loadingcity: false,
      optionscity: [],
      selectedData: [],
      creating: true,
      updateIndex: -1,
      contactClue: false,
      columns: [
        // { title: "基本信息", key: "info", fixed: "left", width: 150 },
        { title: "基本信息", slot: "info", fixed: "left", width: 150 },
        { title: "创建时间", key: "created_at", width: 160 },
        // { title: '电话', key: 'phone', width: 125 },
        // { title: '微信', key: 'weixin', width: 100 },
        // { title: "部位", slot: "post", width: 200 },
        // { title: '搜索词', key: 'searchTerms', minWidth: 118 },
        { title: "来源渠道", key: "source_channel", width: 100 },
        { title: "手机号", key: "mobile", width: 120 },
        { title: "线索状态", slot: "state", width: 130 },
        // { title: '唯一身份', key: 'unique', width: 108 },
        // { title: '疾病类型', key: 'disease', width: 100 },
        // { title: '对话方式', key: 'dialogue', slot: 'dialogue', width: 100 },
        { title: "录入人员", key: "input_name", width: 100 },
        // { title: '标签', key: 'label', slot: 'label', minWidth: 125 },
        {
          title: "客服备注",
          key: "customer_remark",
          minWidth: 120,
          ellipsis: true,
          tooltip: true,
        },
        {
          title: "咨询备注",
          key: "advisory_remark",
          minWidth: 120,
          ellipsis: true,
          tooltip: true,
        },
        {
          title: "联系人员",
          key: "contact_name",
          minWidth: 120,
          ellipsis: true,
          tooltip: true,
        },
        {
          title: "渠道备注",
          key: "source_remark",
          minWidth: 120,
          ellipsis: true,
          tooltip: true,
        },
        {
          title: "操作",
          key: "operation",
          slot: "operation",
          fixed: "right",
          width: 220,
        },
      ],
      datas: { type: "chat" },
      //  hq
      params: {
        departmentId: "",
        page: 1,
        pageSize: 10,
        keyword: "",
        clue_status_id: "",
        source_channel_id: "",
        input_id: "",
        contact_id: "",
        have_repeat: 0,
        contact_way: 0,
        start_date: new Date(),
        end_date: new Date(),
      },
      createData: {
        id: undefined,
        user_name: "",
        mobile: "",
        wechat_num: "",
        qq_num: "",
        dy_num: "",
        age: null,
        gender: "",
        channel_id: "",
        customer_remark: "",
        source_remark: "",
        body_parts_ids: [],
        upload_talk_img: [],
      },
      createDatas: {
        id: undefined,
        user_name: "",
        gender_str: "",
        age: null,
        mobile: "",
        createDatas: "",
        wechat_num: "",
        qq_num: "",
        dy_num: "",
        channel: "",
        customer_remark: "",
        body_parts_arr: [],
        upload_talk_img: [],
        images_host: "",
      },
      createDataing: {
        id: undefined,
        user_name: "",
        gender_str: "",
        age: null,
        mobile: "",
        createDatas: "",
        wechat_num: "",
        qq_num: "",
        dy_num: "",
        channel: "",
        customer_remark: "",
        body_parts_arr: [],
        upload_talk_img: [],
        images_host: "",
      },
      postList: [],
      channelList: [],
      clueList: [],
      operationMember: [],
      operationMembers: [],
      options: {
        disabledDate(date) {
          return date && date.valueOf() > Date.now();
        },
      },
      optionss: {
        disabledDate(date) {
          return date && date.valueOf() < Date.now() - 24 * 3600 * 1000;
        },
      },
      createRules: {
        mobile: [
          {
            required: false,
            message: "请输入正确的联系号码",
            pattern: /^\d{10,12}$/,
            trigger: "blur",
          },
        ],
        qq_num: [
          {
            required: false,
            message: "请输入正确的QQ号",
            pattern: /^[0-9]*$/,
            trigger: "blur",
          },
        ],
        dy_num: [
          // {
          //     required: false,
          //     message: "请输入正确的抖音号",
          //     pattern: /^[0-9]*$/,
          //     trigger: "blur",
          // },
        ],
      },
      clue_contact_results_list: [],
      patientStatusArr: [],
      contactDatas: true,
      data: [],
      first: 0,
      edit: false,
      preBirthday: "",
      params1: {
        id: undefined,
        clue_status_id: "8",
        remark: "",
        day: 1,
        bodyPart: [],
        day1: 0,
        type: 2,
        weChartNum: "",
        mobile: "",
        userName: "",
        age: 0,
        birthday: "",
        sex: "",
        city: "",
        oneDiseases: "",
        twoDiseases: "",
        patientStatus: "2",
      },
      showCreate: false,
      loading: false,
      total: 0,
      fuzzySearch: {},
      timedate: [new Date(), new Date()],
      exporttext: "导出",
      exportloading: false,
      taloading: true,
      pageOpts: [10, 20, 30, 50], // 分页每页数量
    };
  },
  computed: {
    bodyPartRule() {
      if (this.params1.oneDiseases === "1") {
        return {
          required: true,
          validator: (rule, value, callback) => {
            if (value.length) {
              callback();
            } else {
              callback(new Error("请选择部位"));
            }
          },
          trigger: "change",
        };
      } else {
        return {
          required: false,
          type: "array",
          trigger: "change",
        };
      }
    },
    remarkRule() {
      if (this.params1.clue_status_id === "8") {
        return {
          required: false,
          type: "string",
          message: "请输入备注原因",
          trigger: "blur",
        };
      } else {
        return {
          required: true,
          type: "string",
          message: "请输入备注原因",
          trigger: "blur",
        };
      }
    },
    twoRules() {
      if (this.diseasesArr2.length) {
        return {
          required: true,
          message: "请选择二级病种",
          trigger: "change",
        };
      } else {
        return {
          required: false,
          message: "请选择二级病种",
          trigger: "change",
        };
      }
    },
    birthdays() {
      if (this.params1.age) {
        var year = new Date().getFullYear() - this.params1.age;
        return year + "-01" + "-01";
      }
    },
    ...mapState("power/inputexport", [
      "buttonloading",
      "exporturl",
      "buttonbool",
    ]),
  },
  methods: {
    cityvalue(city) {
      this.city_id = city;
      this.params1.city_id = city.join(",");
      // this.askData();
    },
    changeDepartment(value) {
      this.operationMember = [];
      this.params.input_id = "";
      if (value) {
        this.operationMember = this.operationMembers.filter(
          (ee) => ee.department_id === value
        );
      } else {
        this.operationMember = this.operationMembers;
      }
      this.askData();
    },
    ...mapMutations("power/inputexport", [
      "changeLoading",
      "changebool",
      "changeUrl",
    ]),
    // 初始化
    initial() {
      this.askData();
    },

    clearOne() {
      this.diseasesArr2 = [];
      this.params1.twoDiseases = "";
    },
    changeOne(value) {
      if (value) {
        this.diseasesArr2 = this.diseasesArr1.filter(
          (ee) => ee.value == value
        )[0].children;
        this.params1.twoDiseases = "";
        if (!this.diseasesArr2.length) {
          this.$nextTick(() => {
            this.$refs.formItem.validateField("twoDiseases");
          });
        }
      }
    },
    changeRemote(value) {
      // this.$refs.citySearch.setQuery(null);
      // this.params1.city = value;
    },
    // 请求数据
    askData() {
      this.loading = true;
      clueuserentrylist(this.params).then((res) => {
        this.data = Object.freeze(res.list);
        this.total = res.total;
        this.loading = false;
      });
    },
    changeclue(e) {
      for (let item of this.clueList) {
        if (e === item.value) {
          if (+item.value === 8) this.contactDatas = true;
          else this.contactDatas = false;
        }
      }
    },
    openInfo(data) {
      clueuserinfo({ id: data.id, type: 2 }).then((res) => {
        this.infoData = res;
        this.showInfoModal = true;
      });
    },
    askDatas() {
      if (this.params.keyword !== "") {
        if (JSON.stringify(this.timedate) !== JSON.stringify(["", ""])) {
          let timer = [
            dayjs(this.timedate[0]).format("YYYY-MM-DD"),
            dayjs(this.timedate[1]).format("YYYY-MM-DD"),
          ];
          this.storage.set("clue-entry", timer);
          this.timedate = [];
          this.params.start_date = "";
          this.params.end_date = "";
        }
      } else {
        if (
          JSON.stringify(this.storage.get("clue-entry")) !==
          JSON.stringify(["", ""])
        ) {
          this.timedate = this.storage.get("clue-entry");
          this.params.start_date = this.timedate[0];
          this.params.end_date = this.timedate[1];
        }
      }
      this.params.page = 1;
      this.params.pageSize = 10;
      this.params.clue_status_id = "";
      this.params.channel_id = "";
      this.params.input_id = "";
      this.params.contact_id = "";
      this.askData();
    },
    askDataings(value) {
      // console.log(value)
      // if (value) {
      //     this.askDataing()
      // }
    },
    askDataing() {
      this.params.page = 1;
      this.askData();
    },
    askDatatime() {
      this.params.page = 1;
      this.params.start_date = this.timedate[0];
      this.params.end_date = this.timedate[1];
      let timer = ["", ""];
      if (JSON.stringify(this.timedate) !== JSON.stringify(["", ""])) {
        timer = [
          dayjs(this.timedate[0]).format("YYYY-MM-DD"),
          dayjs(this.timedate[1]).format("YYYY-MM-DD"),
        ];
      }
      this.storage.set("clue-entry", timer);
      this.askData();
    },
    getDatas: lodash.debounce(function(params) {
      if (this.optionscity.every((ee) => ee.label !== params)) {
        this.loadingcity = true;
        patientindexsearchcity({
          keywords: params,
        }).then((res) => {
          this.$nextTick(() => {
            this.loadingcity = false;
            this.optionscity = Object.freeze(
              res.list.map((ee) => {
                return {
                  value: ee.value + "," + params,
                  label: ee.label,
                };
              })
            );
          });
        });
      }
    }, 700),
    remoteMethod(query) {
      if (query !== "") {
        this.getDatas(query);
      } else {
        this.optionscity = [];
      }
    },
    /* @函数功能: 分页 */
    formSize(e) {
      this.params.page = e;
      this.askData();
    },
    /* @函数功能: 每页数量 */
    formChangePage(e) {
      this.params.pageSize = e;
      this.askData();
    },
    handleDrawerCancels() {
      this.$refs.create.resetFields();
      this.showCreate = false;
    },
    // 编辑或新增
    handleedit(row) {
      if (row) {
        this.edit = false;
        this.clueuserinfofun(row.id);
      } else {
        this.edit = true;
        this.clueuserinfofun(0);
      }
      this.showCreate = true;
    },
    // 编辑或新增详情接口
    clueuserinfofun(id) {
      return new Promise((resolve, reject) => {
        this.channelList = [];
        clueuserinfo({ id, type: 2 }).then((res) => {
          if (
            res.contact.length &&
            res.contact[res.contact.length - 1].status_name === "转客户"
          ) {
            this.contactClue = false;
            this.$Modal.warning({
              title: "提示消息",
              content: "该条线索已被转客户，请处理其它线索",
              onOk: () => {
                this.askData();
              },
            });
          }
          this.contact = res.contact;
          this.diseasesArr1 = res.diseases;
          this.patientStatusArr = res.patient_status;
          this.postList = res.body_parts_list;
          res.source_channel.forEach((item) => {
            if (+item.source_type === 0) this.channelList.push(item);
          });
          this.department = res.department;
          if (this.taloading && res.department.length) {
            // this.params.departmentId = res.department[0].value
            // this.operationMember = res.operation_member.filter(ee => ee.department_id === res.department[0].value)
            this.taloading = false;
          }
          this.clueList = res.clue_status;
          this.operationMembers = res.operation_member;
          this.operationMember = res.operation_member;
          this.contact_member = res.contact_member;
          this.clue_contact_results_list = res.info.clue_contact_results_list;
          (this.createData = {
            id: id,
            user_name: res.info.user_name,
            age: res.info.age ? res.info.age : null,
            gender_str: res.info.gender_str,
            source_remark: res.info.source_remark,
            mobile: res.info.mobile,
            wechat_num: res.info.wechat_num,
            qq_num: res.info.qq_num,
            dy_num: res.info.dy_num,
            // age: res.info.age || 1,
            gender: res.info.gender,
            channel_id: res.info.channel_id + "",
            customer_remark: res.info.customer_remark,
            body_parts_ids: res.info.body_parts_id_arr,
            upload_talk_img: JSON.stringify(res.info.upload_talk_img),
          }),
            (this.createDatas = {
              id: id,
              user_name: res.info.user_name,
              age: +res.info.age ? +res.info.age : null,
              gender_str: res.info.gender_str,
              mobile: res.info.mobile,
              source_remark: res.info.source_remark,
              wechat_num: res.info.wechat_num,
              qq_num: res.info.qq_num,
              dy_num: res.info.dy_num,
              channel: res.info.channel,
              customer_remark: res.info.customer_remark,
              body_parts_arr: res.info.body_parts_arr,
              upload_talk_img: res.info.upload_talk_img,
              images_host: res.info.images_host,
            });
          this.params1.id = id;
          this.params1.userName = res.info.user_name;
          this.params1.sex = res.info.gender;
          this.params1.bodyPart = res.info.body_parts_id_arr;
          this.params1.age = +res.info.age ? +res.info.age : null;
          this.params1.mobile = res.info.mobile;
          this.params1.weChartNum = res.info.wechat_num;
          if (res.default_city && JSON.stringify(res.default_city) !== "{}") {
            this.optionscity = [
              {
                value: res.default_city.city_id,
                label: res.default_city.city_name,
              },
            ];
            // this.params1.city = res.default_city.city_id;
          }

          this.params1.birthday = res.info.birthday;
          this.preBirthday = res.info.age;
          this.defaultList = [];
          this.uploadList = [];
          for (let item of res.info.upload_talk_img) {
            this.defaultList.push({
              name: res.info.images_host,
              url: item,
            });
            this.uploadList.push({
              url: `${res.info.images_host}${item}`,
              urls: item,
            });
          }
          resolve();
        });
      });
    },
    // 联系线索客户
    handleContactClue(row) {
      this.$refs.formItem.resetFields();
      this.clueuserinfofun(row.id);
      this.contactClue = true;
      this.params1.id = row.id;
      this.params1.patientStatus = "2";
    },
    telrepeat(data) {
      let config = {
        data_type: 1,
        type: 0,
        id: this.params1.id === undefined ? 0 : this.params1.id,
        mobile: data,
      };
      clueusersearchrepeat(config).then((res) => {
        if (res) {
          this.$Message.warning({
            duration: 2.5,
            content: "该手机号码已存在",
          });
        }
      });
    },
    WXrepeat(data) {
      let config = {
        data_type: 1,
        type: 0,
        id: this.params1.id === undefined ? 0 : this.params1.id,
        wechat_num: data,
      };

      clueusersearchrepeat(config).then((res) => {
        if (res) {
          this.$Message.warning({
            duration: 2.5,
            content: "该微信号已存在",
          });
        }
      });
    },
    DYrepeat(data) {
      let config = {
        data_type: 1,
        type: 0,
        id: this.params1.id === undefined ? 0 : this.params1.id,
        dy_num: data,
      };

      clueusersearchrepeat(config).then((res) => {
        if (res) {
          this.$Message.warning({
            duration: 2.5,
            content: "该抖音号已存在",
          });
        }
      });
    },
    repeatData(data) {
      this.repeatDatas = true;
      this.entryloading = true;
      repeatData({
        id: data.id,
      }).then((res) => {
        this.repeatDataList = res.list;
        this.repeatInfo = res.info;
        this.entryloading = false;
      });
    },
    repeatuser(data) {
      this.repeatusers = true;
      this.entryloadings = true;
      clueuserrepeatuser({
        id: data.id,
      }).then((res) => {
        this.repeatuserList = res;
        this.entryloadings = false;
      });
    },
    // 上传文件
    successUpload(response, file, fileList) {
      let list = [];
      let lists = [];
      for (let item of fileList) {
        if (item.response) {
          list.push(item.response.data.path[0]);
          lists.push({
            url: `${item.response.data.host}${item.response.data.path[0]}`,
            urls: item.response.data.path[0],
          });
        }
        if (item.url) {
          list.push(item.url);
          lists.push({
            url: `${item.name}${item.url}`,
            urls: item.url,
          });
        }
      }
      //  数组去重
      this.createData.upload_talk_img = JSON.stringify(
        Array.from(new Set(list))
      );
      this.uploadList = Array.from(new Set(lists));
    },
    findPid(id, list) {
      list.forEach((ee) => {
        if (ee.id === id) {
          return ee.pid;
        } else {
          if (ee.children && ee.children.length) {
            this.findPid(id, ee.children);
          }
        }
      });
    },
    // 新增或编辑提交
    handleCreate() {
      this.$refs.create.validate((valid) => {
        if (valid) {
          this.remarksloading = true;
          this.createDataing = { ...this.createData };
          this.createDataing.body_parts_ids = this.createDataing.body_parts_ids.join(
            ","
          );
          if (
            this.createData.mobile ||
            this.createData.wechat_num ||
            this.createData.dy_num
          ) {
            // checkPhone_Wx({
            //     id: this.createData.id,
            //     mobile: this.createData.mobile,
            //     wechat_num: this.createData.wechat_num,
            //     dy_num: this.createData.dy_num,
            // }).then((res) => {
            //     if (res.mobile === true && res.wechat === true && res.dy_num === true) {
            //         this.$Modal.confirm({
            //             title: "提示",
            //             content:
            //                 "该手机号、微信号和抖音号已存在，是否继续录入",
            //             onOk: () => {
            //                 this.add_or_edit_patient(
            //                     this.edit,
            //                     createData
            //                 );
            //             },
            //             onCancel: () => {
            //                 this.remarksloading = false;
            //             },
            //         });
            //         return
            //     } else if (res.mobile === true && res.wechat === true && res.dy_num === false) {
            //         this.$Modal.confirm({
            //             title: "提示",
            //             content: "该手机号和微信号已存在，是否继续录入",
            //             onOk: () => {
            //                 this.add_or_edit_patient(
            //                     this.edit,
            //                     createData
            //                 );
            //             },
            //             onCancel: () => {
            //                 this.remarksloading = false;
            //             },
            //         });
            //         return
            //     } else if (res.mobile === true && res.wechat === false && res.dy_num === true) {
            //         this.$Modal.confirm({
            //             title: "提示",
            //             content: "该手机号和抖音号已存在，是否继续录入",
            //             onOk: () => {
            //                 this.add_or_edit_patient(
            //                     this.edit,
            //                     createData
            //                 );
            //             },
            //             onCancel: () => {
            //                 this.remarksloading = false;
            //             },
            //         });
            //         return
            //     } else if (res.mobile === false && res.wechat === true && res.dy_num === true) {
            //         this.$Modal.confirm({
            //             title: "提示",
            //             content: "该微信号和抖音号已存在，是否继续录入",
            //             onOk: () => {
            //                 this.add_or_edit_patient(
            //                     this.edit,
            //                     createData
            //                 );
            //             },
            //             onCancel: () => {
            //                 this.remarksloading = false;
            //             },
            //         });
            //         return
            //     } else if (res.mobile === true && res.wechat === false && res.dy_num === false) {
            //         this.$Modal.confirm({
            //             title: "提示",
            //             content: "该手机号已存在，是否继续录入",
            //             onOk: () => {
            //                 this.add_or_edit_patient(
            //                     this.edit,
            //                     createData
            //                 );
            //             },
            //             onCancel: () => {
            //                 this.remarksloading = false;
            //             },
            //         });
            //         return
            //     } else if (res.mobile === false && res.wechat === true && res.dy_num === false) {
            //         this.$Modal.confirm({
            //             title: "提示",
            //             content: "该微信号已存在，是否继续录入",
            //             onOk: () => {
            //                 this.add_or_edit_patient(
            //                     this.edit,
            //                     createData
            //                 );
            //             },
            //             onCancel: () => {
            //                 this.remarksloading = false;
            //             },
            //         });
            //         return
            //     } else if (res.mobile === false && res.wechat === false && res.dy_num === true) {
            //         this.$Modal.confirm({
            //             title: "提示",
            //             content: "该抖音号已存在，是否继续录入",
            //             onOk: () => {
            //                 this.add_or_edit_patient(
            //                     this.edit,
            //                     createData
            //                 );
            //             },
            //             onCancel: () => {
            //                 this.remarksloading = false;
            //             },
            //         });
            //         return
            //     } else if (res.mobile === false && res.wechat === false && res.dy_num === false) {
            //         this.add_or_edit_patient(this.edit, createData);
            //     }
            // });
            let params = {
              mobile: this.createData.mobile,
              type: 1,
              wechat_num: this.createData.wechat_num,
              dy_num: this.createData.dy_num,
              data_type: 1,
              id: this.createData.id,
            };
            this.$refs.copytable.initial(params);
          } else {
            this.add_or_edit_patient(this.edit, this.createDataing);
          }
        }
      });
    },
    add_or_edit_patient(type, params) {
      this.logs("huangqi", type, params);
      let pid = "";
      for (let items of this.channelList) {
        if (+params.channel_id === +items.id) {
          pid = items.pid;
        } else {
          for (let item of items.children) {
            if (+params.channel_id === +item.id) {
              pid = item.pid;
            }
          }
        }
      }
      if (type) {
        clueusercreate({ ...params, pid })
          .then(() => {
            this.remarksloading = false;
            this.askData();
            this.showCreate = false;
          })
          .catch(() => {
            this.remarksloading = false;
          });
      } else {
        clueuserupdate({ ...params, pid })
          .then(() => {
            this.askData();
            this.remarksloading = false;
            this.showCreate = false;
          })
          .catch(() => {
            this.remarksloading = false;
          });
      }
    },
    handleView(url) {
      this.imgName = url;
      this.visible = true;
    },
    removeUpload(urls) {
      const fileList = this.$refs.upload.fileList;
      for (let index in fileList) {
        if (fileList[index].response) {
          if (urls === fileList[index].response.data.path[0]) {
            this.$refs.upload.fileList.splice(index, 1);
          }
        }
        if (fileList[index].url) {
          if (urls === fileList[index].url) {
            this.$refs.upload.fileList.splice(index, 1);
          }
        }
      }
      let list = [];
      let lists = [];
      for (let item of fileList) {
        if (item.response) {
          list.push(item.response.data.path[0]);
          lists.push({
            url: `${item.response.data.host}${item.response.data.path[0]}`,
            urls: item.response.data.path[0],
          });
        }
        if (item.url) {
          list.push(item.url);
          lists.push({
            url: `${item.name}${item.url}`,
            urls: item.url,
          });
        }
      }
      //  数组去重
      this.createData.upload_talk_img = JSON.stringify(
        Array.from(new Set(list))
      );
      this.uploadList = Array.from(new Set(lists));
    },
    handleDrawerCancel(name) {
      (this.city_id = []), this.$refs[name].resetFields();
      (this.contactDatas = true), (this.contactClue = false);
      this.params1 = {
        id: undefined,
        clue_status_id: "8",
        remark: "",
        day: 1,
        day1: 0,
        type: 2,
        bodyPart: [],
        userName: "",
        mobile: "",
        wechat_num: "",
        age: null,
        birthday: "",
        sex: "",
        city_id: "",
        oneDiseases: "",
        twoDiseases: "",
        patientStatus: "2",
      };
      this.createDatas = {
        id: undefined,
        user_name: "",
        mobile: "",
        wechat_num: "",
        qq_num: "",
        dy_num: "",
        channel: "",
        customer_remark: "",
        body_parts_arr: [],
        upload_talk_img: [],
        images_host: "",
      };
      this.diseasesArr2 = [];
      this.diseasesArr1 = [];
    },
    // 搜索手机号
    handlesearch(name) {
      this.$refs[name].validate((valid) => {
        if (valid) {
          if (this.params1.clue_status_id === "8") {
            let config = {
              id: this.params1.id === undefined ? 0 : this.params1.id,
              mobile: this.params1.mobile,
              wechat_id: this.params1.weChartNum,
            };
            patientindexsearchmobile(config).then((res) => {
              if (+res.result === 1) {
                this.$Modal.confirm({
                  title: "提示",
                  content: `<p>该手机号码已存在，是否继续录入?</p>`,
                  onOk: () => {
                    this.handleSubmit();
                  },
                  onCancel: () => {
                    this.remarksloading = false;
                  },
                });
              } else if (+res.result === 2) {
                this.$Modal.confirm({
                  title: "提示",
                  content: `<p>该微信号已存在，是否继续录入?</p>`,
                  onOk: () => {
                    this.handleSubmit();
                  },
                  onCancel: () => {
                    this.remarksloading = false;
                  },
                });
              } else if (+res.result === 3) {
                this.$Modal.confirm({
                  title: "提示",
                  content: `<p>该手机号/微信号已存在，是否继续录入?</p>`,
                  onOk: () => {
                    this.handleSubmit();
                  },
                  onCancel: () => {
                    this.remarksloading = false;
                  },
                });
              } else {
                this.handleSubmit();
              }
            });
          } else {
            this.handleSubmit();
          }
        }
      });
    },
    handleSubmit(name) {
      let params = {
        id: this.params1.id,
        clue_status_id: this.params1.clue_status_id,
        remark: this.params1.clue_status_id === "8" ? "" : this.params1.remark,
        day:
          this.params1.clue_status_id === "8" &&
          (this.params1.patientStatus === "2" ||
            this.params1.patientStatus === "1")
            ? parseInt(new Date(this.DatePicker).getTime() / 1000)
            : "",
        type: 2,
        patient_status_id:
          this.params1.clue_status_id === "8" ? this.params1.patientStatus : "",
        user_name:
          this.params1.clue_status_id === "8" ? this.params1.userName : "",
        age: this.params1.clue_status_id === "8" ? this.params1.age : "",
        // birthday:
        //     this.params1.clue_status_id === "8"
        //         ? this.params1.age === this.preBirthday
        //             ? this.params1.birthday
        //                 ? this.params1.birthday
        //                 : this.birthdays
        //             : this.birthdays
        //         : "",
        birthday: this.params1.clue_status_id === "8" ? this.birthdays : "",
        patient_diseases_id:
          this.params1.clue_status_id === "8" ? this.params1.oneDiseases : "",
        patient_diseases_child_id:
          this.params1.clue_status_id === "8" ? this.params1.twoDiseases : "",
        patient_remake:
          this.params1.clue_status_id === "8" ? this.params1.remark : "",
        city_id:
          this.params1.clue_status_id === "8" ? this.params1.city_id : "",
        appointment_day:
          this.params1.clue_status_id === "8" &&
          this.params1.patientStatus === "1"
            ? parseInt(new Date(this.DatePicker1).getTime() / 1000)
            : "",
        gender: this.params1.clue_status_id === "8" ? this.params1.sex : "",
        // city_name: this.params1.city
        //     ? this.optionscity.filter(
        //         (ee) => ee.value === this.params1.city
        //     )[0].label
        //     : "",
        wechat_num:
          this.params1.clue_status_id === "8" ? this.params1.weChartNum : "",
        mobile: this.params1.clue_status_id === "8" ? this.params1.mobile : "",
        body_parts_id:
          this.params1.clue_status_id === "8"
            ? this.params1.bodyPart.join(",")
            : "",
      };
      this.remarksloading = true;
      clueusercontact(params)
        .then(() => {
          (this.city_id = []), (this.remarksloading = false);
          this.askData();
          this.$Message.success("联系成功!");
          this.contactClue = false;
          this.$refs.formItem.resetFields();
          this.diseasesArr2 = [];
        })
        .catch(() => {
          this.remarksloading = false;
        });
    },
    blurday(num) {
      this.DatePicker = this.$blurday(num);
    },
    changeday(date) {
      this.params1.day = this.$changeday(date);
    },
    blurday1(num) {
      this.DatePicker1 = this.$blurday(num);
    },
    changeday1(date) {
      this.params1.day1 = this.$changeday(date);
    },
    clickexport() {
      // this.exportloading = true
      this.changeLoading(true);
      this.exporttext = "正在导出";
      this.changebool(false);
      let config = {
        clue_status_id: this.params.clue_status_id,
        input_id: this.params.input_id,
        contact_id: this.params.contact_id,
        source_channel_id: this.params.source_channel_id,
        start_date: this.params.start_date,
        end_date: this.params.end_date,
        keyword: this.params.keyword,
      };
      clueuserexport(config).then((res) => {
        this.exportloading = false;
        this.exporttext = "导出";
        // this.buttonbool = true
      });
    },
    clickexports() {
      let urltitle = Setting.apiBaseURL;
      let url = `${urltitle}/${this.exporturl}`;
      window.open(url);
    },
    checkbox3(e) {
      this.params.page = 1;
      this.params.have_repeat = e.length;
      this.timedate = [];
      this.params.start_date = "";
      this.params.end_date = "";
      this.askData();
    },
    checkbox4(e) {
      this.params.page = 1;
      this.params.contact_way = e.length;
      this.timedate = [];
      this.params.start_date = "";
      this.params.end_date = "";
      this.askData();
    },
  },
  async mounted() {
    this.url = this.$Setting.apiBaseURL;
    await this.clueuserinfofun(0);
    await this.initial();
  },
};
</script>
<style scoped>
.repeatColor {
  color: red;
}

.person {
  color: #999;
}

.demo-upload-list {
  display: inline-block;
  width: 60px;
  height: 60px;
  text-align: center;
  line-height: 60px;
  border: 1px solid transparent;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  position: relative;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  margin-right: 4px;
}

.demo-upload-list img {
  width: 100%;
  height: 100%;
}

.demo-upload-list-cover {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
}

.demo-upload-list:hover .demo-upload-list-cover {
  display: block;
}

.demo-upload-list-cover i {
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  margin: 0 2px;
}

.content {
  white-space: pre-wrap;
}
</style>
